<script lang="ts" setup>
import { message } from 'ant-design-vue';
import type { IPageRequest, ISearchParams } from '@/types/request';

const { onSearchRequest, searchParams } = defineProps<{
  name: string
  showTime?: boolean
  searchParams: ISearchParams
  onSearchRequest: () => Promise<IPageRequest<any>>
}>()

async function handleSearchRequest() {
  try {
    // 搜索后重置显示第一页数据
    searchParams.page = 1
    const { data } = await onSearchRequest()
    searchParams.total = data.total_record
  } catch (error: any) {
    message.error(error.message || error)
  }
}
</script>

<template>
  <div flex="~ center" gap="2" m="b-6">
    <span flex="shrink-0">搜索{{ name }}：</span>
    <a-input v-model:value="searchParams.condition" @keypress.enter.native="handleSearchRequest" />
    <a-button type="primary" @click="handleSearchRequest" style="background-color:#1677ff">搜索</a-button>
    <div v-if="showTime" flex="~ center shrink-0" gap="2">
      <a-time-picker v-model:value="searchParams.gmt_start" placeholder="开始时间" />
      <a-time-picker v-model:value="searchParams.gmt_end" placeholder="结束时间" />
    </div>
  </div>
</template>
